<include file="Public:js" /> 
<style type="text/css">
.menuTree{ margin-left:0px;}
.menuTree div{ padding-left:1px;}
.menuTree div ul{ overflow:hidden; display:none; height:auto; margin:0;}
.menuTree span{ display:block; height:20px; line-height:25px; padding-left:5px; margin:1px 0; cursor:pointer; border-bottom:1px solid #CCC;}
.menuTree span:hover{ background-color:#e6e6e6; color:#cf0404;}
.menuTree a{ color:#333; text-decoration:none;}
.menuTree a:hover{ color:#06F;}
.menuTree span{height: 50px;}
</style>
<div class="main-wrap">

        <div class="crumb-wrap">
            <div class="crumb-list"><i class="icon-font"></i><a href="#">首页</a><span class="crumb-step">&gt;</span><span class="crumb-name">分类列表</span></div>
        </div>
        
        <div class="search-wrap">
            <div class="search-content">
                <form action="" method="post">
                    <!-- <table class="search-tab">
                        <tr>
                           
                            
                            <th width="70">关键字:</th>
                            <td><input class="common-text" placeholder="关键字" name="keywords" value="" id="" type="text"></td>
                            <td><input class="btn btn-primary btn2" name="sub" value="查询" type="submit"></td>
                        </tr>
                    </table> -->
                </form>
            </div>
        </div>
        <div class="result-wrap">
           
                <div class="result-title">
                    <div class="result-list">
                       <!--  <a href="{:U('Terms/add')}"><i class="icon-font"></i>新增</a> -->
                       <!-- <a id="batchDel" href="javascript:void(0)"><i class="icon-font"></i>批量删除</a>
                        <a id="updateOrd" href="javascript:void(0)"><i class="icon-font"></i>更新排序</a>-->
                        <!-- <a   href="javascript:history.back(-1);"><i class="icon-font"></i>返回</a> -->
                    </div>
                </div>
                <div class="result-content">
                    <div id="menuTree" class="menuTree"></div> 
                     <div class="list-page">{$page}</div>
                </div>
          
        </div>
    </div>

  <script type="text/javascript">
var json = {$data}
/*递归实现获取无级树数据并生成DOM结构*/
    var str = "";
    var forTree = function(o){
        for(var i=0;i<o.length;i++){
             var urlstr = "";
             try{
                    if(typeof o[i]["url"] == "undefined"){
                        urlstr = "<div style='margin-left:20px;'><span style='padding-top:18px'>|--"+ o[i]["cat_name"] +"<a href='__CONTROLLER__/fieldList/term_id/"+o[i]["cat_id"]+"' style='float:right;'>商品信息</a></span><ul>";
                    }else{
                        urlstr = "<div style='margin-left:20px;'><span>"+"<a href="+ o[i]["url"] +">"+ o[i]["cat_name"] +"</a></span></span><ul>"; 
                    }
                str += urlstr;
                if(o[i]["son"] != null){
                    forTree(o[i]["son"]);
                }
             str += "</ul></div>";
            }catch(e){}
        }
     return str;
    }
    /*添加无级树*/
    document.getElementById("menuTree").innerHTML = forTree(json);

    /*树形菜单*/
    var menuTree = function(){
     //给有子对象的元素加
         $("#menuTree ul").each(function(index, element) {
            var ulContent = $(element).html();
            var spanContent = $(element).siblings("span").html();
            if(ulContent){
                 $(element).siblings("span").html(spanContent) 
            }
         });

         $("#menuTree").find("div span").click(function(){
             var ul = $(this).siblings("ul");
             var spanStr = $(this).html();
             var spanContent = spanStr.substr(3,spanStr.length);
             if(ul.find("div").html() != null){
                 if(ul.css("display") == "none"){
                     ul.show(300);
                     // $(this).html("[-]" + spanContent);
                 }else{
                    ul.hide(300);
                    // $(this).html("[+] " + spanContent);
                 }
            }
         })
    }()

    /*树形列表展开*/
    $("#btn_open").click(function(){
        $("#menuTree ul").show(300);
        curzt("-");
    })

    /*收缩*/
    $("#btn_close").click(function(){
        $("#menuTree ul").hide(300);
        curzt("+");
    })
    function curzt(v){
     $("#menuTree span").each(function(index, element) {
         var ul = $(this).siblings("ul");
         var spanStr = $(this).html();
         var spanContent = spanStr.substr(3,spanStr.length);
         if(ul.find("div").html() != null){
            $(this).html("["+ v +"] " + spanContent);
         }
     }); 
    }


 
//是否确认删除
  function del() 
    { 
      var msg = "您真的确定要删除吗？"; 
      if (confirm(msg)==true)
      { 
      return true; 
      }else{ 
      return false; 
    } 
  } 


</script>